<!DOCTYPE html>
<?php
if(isset($_GET)){

/*
echo '<pre>';
var_dump($_GET);
echo '</pre>';
*/
session_start();
$_SESSION['idFiche']=$_GET['idFiche'];

}
?>
<HTML>
 <HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script src="../_js/jquery-1.10.2.min.js"></script>
<script src="../_js/jquery-ui.js"></script>
 

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">



<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>


 <STYLE type="text/css">

.ficheIdentite{

border : 1px solid black;
width : 700px;
margin : auto;
height : auto;
}

.barreTitre{
width : 650px;
height : 50px;
background-color : blue;
float: left;
padding : 0px;
margin : 0px;
text-align : center;
}

.boutonFermer{
width : 50px;
height: 50px;
background-color : red;
float: left;
padding : 0px;
margin : 0px;
text-align : center;
}

.boutonSupprimer {
width : 150px;
height: 50px;
background-color : red;
float: right;
text-align : center;
}

.boutonEdition{
width : 150px;
height: 50px;
background-color : green;
float: right;
text-align : center;
}

.boutonAnnuler {
width : 150px;
height: 50px;
background-color : red;
float: right;
text-align : center;
}

.boutonValider{
width : 150px;
height: 50px;
background-color : green;
float: right;
text-align : center;
}

#footerFicheId{
	height:50px;
	bottom:0px;
}

.infoFiche{
display:inline-block;

}

  </STYLE>
 
</HEAD>




<BODY>


<div class="ficheIdentite">
	<div id="headerFicheId">
		<div class="barreTitre">FICHE IDENTITE</div>
		<div class="boutonFermer">X</div>
	</div>

	<!--div id="contenuFicheId">
		<div class="infoFiche" id="titre">Mr</div>
		<div class="infoFiche" id="nom">Pipa</div>
		<div class="infoFiche" id="prenom">Philippe</div>
		<div class="infoFiche" id="genre">H</div>
		<div class="infoFiche" id="titre">Email</div>
		<div class="infoFiche" id="titre">Mr</div>
	</div-->


<!--label for="nom">Surname* : </label><input type="text" name="nom" id="nom"-->
	<div id="contenuFicheId">

<form id="formulaire" method="post"> 
		ID : <div class="infoFiche" name="id" id="id" ></div></br>
		Titre : <div class="infoFiche" name="titre" id="titre" ></div></br>
		Nom : <div class="infoFiche" name="nom" id="nom" ></div></br>
		Prenom : <div class="infoFiche" name="prenom" id="prenom" ></div></br>
		Initiale du 2nd prénom: <div class="infoFiche" name="initiale" id="initiale" ></div></br>
		Genre : <div class="infoFiche" name="genre" id="genre" ></div></br>
		Email : <div class="infoFiche" name="email" id="email" ></div></br>
		Type d'inscription : <div class="infoFiche" name="type_ins" id="type_ins" ></div></br>
		Institution : <div class="infoFiche" name="institution" id="institution" ></div></br>
		Type d'institution : <div class="infoFiche" name="type_instit" id="type_instit" ></div></br>
		Laboratoire : <div class="infoFiche" name="laboratoire" id="laboratoire" ></div></br>
		Statut : <div class="infoFiche" name="statut" id="statut" ></div></br>
		Adresse : <div class="infoFiche" name="adresse" id="adresse" ></div></br>
		Ville : <div class="infoFiche" name="ville" id="ville" ></div></br>
		Zip : <div class="infoFiche" name="zip" id="zip" ></div></br>
		Etat : <div class="infoFiche" name="etat" id="etat" ></div></br>
		Pays : <div class="infoFiche" name="pays" id="pays" ></div></br>
		Mobile : <div class="infoFiche" name="mobile" id="mobile" ></div></br>
		Tel : <div class="infoFiche" name="tel" id="tel" ></div></br>
		Nationalité : <div class="infoFiche" name="nationalite" id="nationalite" ></div></br>
		Nombre de résumé : <div class="infoFiche" name="nb_resume" id="nb_resume" ></div></br>
		Alimentation : <div class="infoFiche" name="alimentation" id="alimentation" ></div></br>
		Intolérance : <div class="infoFiche" name="intolerance" id="intolerance" ></div></br>
		Date d'inscription : <div class="infoFiche" name="date_ins" id="date_ins" ></div></br>





	</div>
	
	<div id="footerFicheId">
		<div class="boutonEdition"><div>Modifier</div></div>
		<div class="boutonSupprimer"><div>Supprimer</div></div>
		<div class="boutonValider"><div>Valider</div></div>
		<div class="boutonAnnuler"><div>Annuler</div></div>
				
		
	</div>

</div>

<script>

var listePays = [
		"Afghanistan",
		"Afrique du Sud",
		"Albanie",
		"Algérie",
		"Allemagne",
		"Andorre",
		"Angola",
		"Anguilla",
		"Antarctique",
		"Antigua-et-Barbuda",
		"Antilles néerlandaises",
		"Arabie saoudite",
		"Argentine",
		"Arménie",
		"Aruba",
		"Australie",
		"Autriche",
		"Azerbaïdjan",
		"Bénin",
		"Bahamas",
		"Bahreïn",
		"Bangladesh",
		"Barbade",
		"Belau",
		"Belgique",
		"Belize",
		"Bermudes",
		"Bhoutan",
		"Biélorussie",
		"Birmanie",
		"Bolivie",
		"Bosnie-Herzégovine",
		"Botswana",
		"Brésil",
		"Brunei",
		"Bulgarie",
		"Burkina Faso",
		"Burundi",
		"Côte d-Ivoire",
		"Cambodge",
		"Cameroun",
		"Canada",
		"Cap-Vert",
		"Chili",
		"Chine",
		"Chypre",
		"Colombie",
		"Comores",
		"Congo",
		"Corée du Nord",
		"Corée du Sud",
		"Costa Rica",
		"Croatie",
		"Cuba",
		"Danemark",
		"Djibouti",
		"Dominique",
		"Egypte",
		"Emirats arabes unis",
		"Equateur",
		"Erythrée",
		"Espagne",
		"Estonie",
		"Etats-Unis",
		"Ethiopie",
		"Finlande",
		"France",
		"Géorgie",
		"Gabon",
		"Gambie",
		"Ghana",
		"Gibraltar",
		"Grèce",
		"Grenade",
		"Groenland",
		"Guadeloupe",
		"Guam",
		"Guatemala",
		"Guinée",
		"Guinée équatoriale",
		"Guinée-Bissao",
		"Guyana",
		"Guyane française",
		"Haïti",
		"Honduras",
		"Hong Kong",
		"Hongrie",
		"Ile Bouvet",
		"Ile Christmas",
		"Ile Norfolk",
		"Iles Cayman",
		"Iles Cook",
		"Iles Féroé",
		"Iles Falkland",
		"Iles Fidji",
		"Iles Géorgie du Sud et Sandwich du Sud",
		"Iles Heard et McDonald",
		"Iles Marshall",
		"Iles Pitcairn",
		"Iles Salomon",
		"Iles Svalbard et Jan Mayen",
		"Iles Turks-et-Caicos",
		"Iles Vierges américaines",
		"Iles Vierges britanniques",
		"Iles des Cocos (Keeling)",
		"Iles mineures éloignées des États-Unis",
		"Inde",
		"Indonésie",
		"Iran",
		"Iraq",
		"Irlande",
		"Islande",
		"Israël",
		"Italie",
		"Jamaïque",
		"Japon",
		"Jordanie",
		"Kazakhstan",
		"Kenya",
		"Kirghizistan",
		"Kiribati",
		"Koweït",
		"Laos",
		"Lesotho",
		"Lettonie",
		"Liban",
		"Liberia",
		"Libye",
		"Liechtenstein",
		"Lituanie",
		"Luxembourg",
		"Macao",
		"Madagascar",
		"Malaisie",
		"Malawi",
		"Maldives",
		"Mali",
		"Malte",
		"Mariannes du Nord",
		"Maroc",
		"Martinique",
		"Maurice",
		"Mauritanie",
		"Mayotte",
		"Mexique",
		"Micronésie",
		"Moldavie",
		"Monaco",
		"Mongolie",
		"Montserrat",
		"Mozambique",
		"Népal",
		"Namibie",
		"Nauru",
		"Nicaragua",
		"Niger",
		"Nigeria",
		"Nioué",
		"Norvège",
		"Nouvelle-Calédonie",
		"Nouvelle-Zélande",
		"Oman",
		"Ouganda",
		"Ouzbékistan",
		"Pérou",
		"Pakistan",
		"Panama",
		"Papouasie-Nouvelle-Guinée",
		"Paraguay",
		"Pays-Bas",
		"Philippines",
		"Pologne",
		"Polynésie française",
		"Porto Rico",
		"Portugal",
		"Qatar",
		"République centrafricaine",
		"République démocratique du Congo",
		"République dominicaine",
		"République tchèque",
		"Réunion",
		"Roumanie",
		"Royaume-Uni",
		"Russie",
		"Rwanda",
		"Sénégal",
		"Sahara occidental",
		"Saint-Christophe-et-Niévès",
		"Saint-Marin",
		"Saint-Pierre-et-Miquelon",
		"Saint-Siège ",
		"Saint-Vincent-et-les-Grenadines",
		"Sainte-Hélène",
		"Sainte-Lucie",
		"Salvador",
		"Samoa",
		"Samoa américaines",
		"Sao Tomé-et-Principe",
		"Seychelles",
		"Sierra Leone",
		"Singapour",
		"Slovénie",
		"Slovaquie",
		"Somalie",
		"Soudan",
		"Sri Lanka",
		"Suède",
		"Suisse",
		"Suriname",
		"Swaziland",
		"Syrie",
		"Taïwan",
		"Tadjikistan",
		"Tanzanie",
		"Tchad",
		"Terres australes françaises",
		"Territoire britannique de l-Océan Indien",
		"Thaïlande",
		"Timor Oriental",
		"Togo",
		"Tokélaou",
		"Tonga",
		"Trinité-et-Tobago",
		"Tunisie",
		"Turkménistan",
		"Turquie",
		"Tuvalu",
		"Ukraine",
		"Uruguay",
		"Vanuatu",
		"Venezuela",
		"Viêt Nam",
		"Wallis-et-Futuna",
		"Yémen",
		"Yougoslavie",
		"Zambie",
		"Zimbabwe",
		"ex-République yougoslave de Macédoine"
		];



$(document).ready(function () {


remplirAutoComplete(listePays,'pays')	
// Rempli la page au chargement du doc ===> A CHANGER => remplis la page quand on affiche la div ficheIdentite !!!!
$(function(){
	remplirFicheId()

});

//$('.ficheIdentite').hide();  // N'affiche pas la div au chargement de la page

//$(document).click(function(){$('.ficheIdentite').fadeIn();});  // A supprimer !
$('.boutonValider').hide() // On cache les bouton de la fiche 
$('.boutonAnnuler').hide() // On cache les bouton de la fiche 

	//FAIRE UN .load() sur la page pour afficher la div OU MIEU !!! Faire un .show(function(){ ajax .... }) pour charger la fiche

	$('.boutonFermer').click(function(){
	
		
	window.close();
			//$('.ficheIdentite').fadeOut("fast");



	});	

	$('.boutonEdition').click(function(){
	$.ajax({

	url: "../_ajax/chargeFicheId.php",
	context: document.body,
	

	})
	.done(function(tableau) {
		var tabJs=eval(tableau);
		for(var i=0;i<eval(tabJs).length;i++){
			nomDiv=tabJs[i][0];
			valDiv=tabJs[i][1]
		
		

		if(nomDiv=='titre'){
			if(valDiv=='Mme') 
				var option=	'<OPTION selected>Mme'+
						'<OPTION>M.'+
						'<OPTION>Pr.'+
						'<OPTION>Dr.'
			else if (valDiv=='M.') 
				var option=	'<OPTION>Mme'+
						'<OPTION selected>M.'+
						'<OPTION>Pr.'+
						'<OPTION>Dr.'
			else if (valDiv=='Pr.')
				var option=	'<OPTION>Mme'+
						'<OPTION>M.'+
						'<OPTION selected>Pr.'+
						'<OPTION>Dr.'	
			else 
				var option=	'<OPTION>Mme'+
						'<OPTION>M.'+
						'<OPTION>Pr.'+
						'<OPTION selected>Dr.'
				
			$('#'+nomDiv).html('<SELECT class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'"size="1">'+option+'</SELECT>')
		}		
		else if (nomDiv=='id')
			$('#'+nomDiv).html('<div class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" >'+valDiv+'</div></br>')	

		else if(nomDiv=='genre'){
			
			$('#'+nomDiv).html(	'Homme <input id="hHomme" class="infoFiche" type="radio" name="'+nomDiv+'" value="H"\\/\\>'+
						'Femme <input id="fFemme" class="infoFiche" type="radio" name="'+nomDiv+'" value="F"\\/\\></br>')
		
			if(valDiv=='H')
				$( "#hHomme" ).prop( "checked", true );
			else 
				$( "#fFemme" ).prop( "checked", true );
				
		}
		else if(nomDiv=='type_ins'){

			if(valDiv=='Organisateur')
			      var option=	'<OPTION selected>Organisateur'+
						'<OPTION>M.'+
						'<OPTION>Participant'
			else if (valDiv=='Président de séance') 
				var option=	'<OPTION>Organisateur'+
						'<OPTION selected>Président de séance'+
						'<OPTION>Participant'
			else  
				var option=	'<OPTION>Organisateur'+
						'<OPTION>Président de séance'+
						'<OPTION selected>Participant'
						
			$('#'+nomDiv).html('<SELECT class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" size="1">'+option+'</SELECT>')

		}


		else if(nomDiv=='statut'){

			if(valDiv=='Professeur')
			      var option=	'<OPTION selected>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'

			else if (valDiv=='Directeur de laboratoire') 
				var option=	'<OPTION>Professeur'+
						'<OPTION selected>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'

			else if (valDiv=='Assistant') 
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION selected>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'
			else if (valDiv=='Chercheur') 
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION selected>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'
			else if (valDiv=='Stagiaire post-Doctoral') 
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION selected>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'
			else if (valDiv=='Thésard') 
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION selected>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION>Licence'
			else if (valDiv=='Mastère') 
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION selected>Mastère'+
						'<OPTION>Licence'
			else  
				var option=	'<OPTION>Professeur'+
						'<OPTION>Directeur de laboratoire'+
						'<OPTION>Assistant'+
						'<OPTION>Chercheur'+
						'<OPTION>Stagiaire post-Doctoral'+
						'<OPTION>Thésard'+
						'<OPTION>Mastère'+
						'<OPTION selected>Licence'


			$('#'+nomDiv).html('<SELECT class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" size="1">'+option+'</SELECT>')
			

		}		



		else if (nomDiv=='pays'){

			$('#'+nomDiv).html('<input class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" \\/\\></br>')
remplirAutoComplete(listePays,'pays')	
}
		else if (nomDiv=='nationalite')
			$('#'+nomDiv).html('<div class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" >A CODER SALE FLEMMARD ! </div></br>')	
		

		else if (nomDiv=='alimentation'){

			if(valDiv=='Végétarienne') 
				var option=	'<OPTION selected>Indifférent'+
						'<OPTION>Halal'+
						'<OPTION>Cacher'+
						'<OPTION selected>Végétarienne'
			else if (valDiv=='Halal') 
				var option=	'<OPTION>Indifférent'+
						'<OPTION selected>Halal'+
						'<OPTION>Cacher'+
						'<OPTION>Végétarienne'
			else if (valDiv=='Cacher')
				var option=	'<OPTION>Indifférent'+
						'<OPTION>Halal'+
						'<OPTION selected>Cacher'+
						'<OPTION>Végétarienne'	
			else 
				var option=	'<OPTION selected>Indifférent'+
						'<OPTION>Halal'+
						'<OPTION>Cacher'+
						'<OPTION>Végétarienne'

			$('#'+nomDiv).html('<SELECT class="infoFiche" name="'+nomDiv+'" size="1">'+option+'</SELECT>')
		}

		else if(nomDiv=='intolerance'){
			
			$('#'+nomDiv).html(	'Gluten <input id="gGluten" class="infoFiche" type="checkbox" name="'+nomDiv+'" value="Gluten"\\/\\>'+
						'Lactose <input id="lLactose" class="infoFiche" type="checkbox" name="'+nomDiv+'" value="Lactose"\\/\\></br>')
		
			if(valDiv=='Gluten')
				$( "#gGluten" ).prop( "checked", true );
			else if (valDiv=='Lactose')
				$( "#lLactose" ).prop( "checked", true );
			else {
				$( "#gGluten" ).prop( "checked", false );
				$( "#lLactose" ).prop( "checked", false );
			}
		}

		else if (nomDiv=='date_ins')
			$('#'+nomDiv).html('<div class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" >'+valDiv+'</div></br>')	

		else 
		$('#'+nomDiv).html('<input type="text"  class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" value="'+valDiv+'"\\/\\></br>')

		}
		//for (var cle in eval(tableau)){
		//	$.each(tableau[cle]), function(key, val) { 			
			//	alert(key+' '+val);
//
			//	$('#'+key).html('<input type="text"  class="infoFiche" name="'+key+'" id="'+key+'" value="'+val+'"\\/\\></br>')
			//};
		//
	//};
	console.log(eval(tableau));
	});


	$('.boutonSupprimer').hide()  
	$('.boutonEdition').hide()
	$('.boutonValider').show()
	$('.boutonAnnuler').show()
	
	});

	$('.boutonAnnuler').click(function(){
		remplirFicheId()
		$('.boutonValider').hide()
		$('.boutonAnnuler').hide()
		$('.boutonSupprimer').show()
		$('.boutonEdition').show()
	
	});

$('.boutonValider').click(function(){
	
		$('#formulaire').submit();
		alert('Et ba non tu l\'a pas encore fait celle la !')
		
		getValeurFicheIdtoAjaxData()
		remplirFicheId()
		$('.boutonValider').hide()
		$('.boutonAnnuler').hide()
		$('.boutonSupprimer').show()
		$('.boutonEdition').show()
	});

$('.boutonSupprimer').click(function(){
	if(confirm('Vous êtes sur le point de supprimer une fiche.')){

	$.ajax({

	url: "../_ajax/supprimeFiche.php",
	context: document.body,
	})
	.done(function() {
		alert('Fiche supprimer !')
	window.close();
		
	});
}
});



});

function remplirAutoComplete(liste,nomDiv){
		console.log(liste);


		$( "#"+nomDiv ).autocomplete({
			source: liste
		});


}

function remplirFicheId(){

	$.ajax({
	url: "../_ajax/chargeFicheId.php",
	context: document.body,

	})
	.done(function(tableau) {
		var tabJs=eval(tableau);
		for(var i=0;i<eval(tabJs).length;i++){
			nomDiv=tabJs[i][0];
			valDiv=tabJs[i][1];

			$('#'+nomDiv).html('<div class="infoFiche" name="'+nomDiv+'" id="'+nomDiv+'" >'+valDiv+'</div></br>')
							
	}	
	});

}

function getValeurFicheIdtoAjaxData(){
var retour='';
	alert(d3.select('#nom')[0].value);
	retour+=$('#nom').html()+'&'
	retour+=$('#prenom').value+'&'
	retour+=$('#initiale').val()+'&'
	retour+=$('#genre').val()+'&'
	retour+=$('#email').val()+'&'
	retour+=$('#type_ins').val()+'&'
	retour+=$('#institution').val()+'&'
	retour+=$('#type_instit').val()+'&'
	retour+=$('#laboratoire').val()+'&'
	retour+=$('#statut').val()+'&'
	retour+=$('#adresse').val()+'&'
	retour+=$('#ville').val()+'&'
	retour+=$('#zip').val()+'&'
	retour+=$('#etat').val()+'&'
	retour+=$('#pays').val()+'&'
	retour+=$('#mobile').val()+'&'
	retour+=$('#tel').val()+'&'
	retour+=$('#nationalite').val()+'&'
	retour+=$('#nb_resume').val()+'&'
	retour+=$('#alimentation').val()+'&'
	retour+=$('#intolerance').val()+'&'
	retour+=$('#id').val()+'&'

console.log(retour)
//return // un truc genre blabla=blabla&blabla=
}

</script>
</BODY>
  
</HTML>
